<?php

if($_SESSION['languageId']!="")
{
	$languageId=$_SESSION['languageId'];
}
else
{
	$languageId='1';
}

$siteUserId=$_SESSION['siteuserId'];
$selSiteurl=mysql_query("select * from adsite_master where siteuserId='".$siteUserId."'");

if(isset($_POST['next']))
{
    $_SESSION['adspace_type'] = $_POST['adspace_type'];

    if($_POST['ad_Type']=='network')
    {
        $netVal='Y';
    }
    else
    {
        $netVal='N';
    }

    $_SESSION['netVal'] = $netVal;

    $insertAdMaster="insert into adspace_master set adsiteId='".$_POST['site_id']."',
                                                    UserId='".$siteUserId ."',
                                                    langId='".$languageId."',
                                                    ad_Type = '".$_REQUEST['ad_Type']."'";
    //echo $insertAdMaster;
    $exeAdmaster = mysql_query($insertAdMaster);
    $adspaceId = mysql_insert_id();
    $md_no=md5($adspaceId);
    $updateAdMaster=mysql_query("update adspace_master set adspaceIdMd='".$md_no."' where adspaceId='".$adspaceId."' ");
    $insertAd = "insert into adspace_details set adspaceId='".$adspaceId."',
                                                adspaceIdMd='".$md_no."',
                                                adspaceType='".$_POST['adspace_type']."',
                                                adSize='".$_POST['size']."',
                                                fontType='".$_POST['font_type']."',
                                                backgroundColor='".$_POST['background_color']."',
                                                noOfTextAd='".$_POST['cell_count']."',
                                                headerColor='".$_POST['title_color']."',
                                                thumbOrientation='".$_POST['alignment']."',
                                                bodyColor='".$_POST['description_color']."',
                                                allowNetwork='".$netVal."' ";
    //echo $insertAd;
    $exeinsertAd = mysql_query($insertAd);
    $_SESSION['adspaceId']=$adspaceId;

    //header("location:sell_space_add_details.php");
    echo '<script>window.location="sell_space_add_details.php?tab=sell_ads&subMenu=2";</script>';
}
?>
<link rel="stylesheet" href="css/adspace.css" type="text/css">
<link rel="stylesheet" href="css/style_002.css" type="text/css">
<script type="text/javascript" language="javascript" src="JavaScripts/common.js"></script>
<script type="text/javascript" language="javascript" src="JavaScripts/popup-layer.js"></script>
<script type="text/javascript" language="javascript" src="JavaScripts/category-list.js"></script>
<script type="text/javascript" language="javascript" src="JavaScripts/cover.js"></script>
<div id="colorlayer" onMouseOver="javascript:enterColorPalette()" onMouseOut="javascript:leaveColorPalette()" class="drag" style="visibility: hidden; width: 204px; height: 142px; position: absolute; z-index: 4; left: 488px; top: 635px;">
<table bgcolor="#ffffff" border="0" cellpadding="1" cellspacing="2" width="100%">
<tbody>
<tr>
    <td id="selectedcolor" bgcolor="#ff8080" width="12%"></td>
    <td id="colorcode" align="center" width="75%"><b>#FF8080</b></td>
    <td width="12%">
      <div id="transparent" style="cursor: pointer; visibility: hidden;">
          <img alt="" src="images/transparent.gif" onMouseOver="javascript:onTransparent();" onClick="javascript:onClickTransparent();preview();">
      </div>
    </td>
</tr>
</tbody>
</table>
<table id="colortable" style="border: 1px solid rgb(127, 157, 185); cursor: pointer; height: 115px;" bgcolor="#ffffff" border="0" cellpadding="1" cellspacing="2" width="100%">
<tbody>
<!--<tr><td bgcolor="#ff8080" height="17"></td><td bgcolor="#ffff80" height="17"></td><td bgcolor="#80ff80" height="17"></td><td bgcolor="#00ff80" height="17"></td><td bgcolor="#80ffff" height="17"></td><td bgcolor="#0080ff" height="17"></td><td bgcolor="#ff80c0" height="17"></td><td bgcolor="#ff80ff" height="17"></td></tr><tr><td bgcolor="#ff0000" height="17"></td><td bgcolor="#ffff00" height="17"></td><td bgcolor="#80ff00" height="17"></td><td bgcolor="#00ff40" height="17"></td><td bgcolor="#00ffff" height="17"></td><td bgcolor="#0080c0" height="17"></td><td bgcolor="#8080c0" height="17"></td><td bgcolor="#ff00ff" height="17"></td></tr><tr><td bgcolor="#804040" height="17"></td><td bgcolor="#ff8040" height="17"></td><td bgcolor="#00ff00" height="17"></td><td bgcolor="#008080" height="17"></td><td bgcolor="#004080" height="17"></td><td bgcolor="#8080ff" height="17"></td><td bgcolor="#800040" height="17"></td><td bgcolor="#ff0080" height="17"></td></tr><tr><td bgcolor="#800000" height="17"></td><td bgcolor="#ff8000" height="17"></td><td bgcolor="#008000" height="17"></td><td bgcolor="#008040" height="17"></td><td bgcolor="#0000ff" height="17"></td><td bgcolor="#0000a0" height="17"></td><td bgcolor="#800080" height="17"></td><td bgcolor="#8000ff" height="17"></td></tr><tr><td bgcolor="#400000" height="17"></td><td bgcolor="#804000" height="17"></td><td bgcolor="#004000" height="17"></td><td bgcolor="#004040" height="17"></td><td bgcolor="#000080" height="17"></td><td bgcolor="#000040" height="17"></td><td bgcolor="#400040" height="17"></td><td bgcolor="#400080" height="17"></td></tr><tr><td bgcolor="#000000" height="17"></td><td bgcolor="#808000" height="17"></td><td bgcolor="#808040" height="17"></td><td bgcolor="#808080" height="17"></td><td bgcolor="#408080" height="17"></td><td bgcolor="#c0c0c0" height="17"></td><td bgcolor="#400040" height="17"></td><td bgcolor="#ffffff" height="17"></td></tr>--></tbody>
</table>
<iframe src="selling-basic-adspace-add_files/blank_003.html" style="position: absolute; visibility: inherit; top: 0px; left: 0px; width: 204px; height: 142px; z-index: -1;" frameborder="0">
</iframe>
</div>
<script language="javascript" type="text/javascript">
<!--
    var transparent = "transparent";

    var ns = document.getElementById&&!document.all; //boolean flag for netscape/firefox
    var objId; //object id
    var selected; //selected color
    var onchangeFlag = false;
    init();

    //Initialize the color table.
    function init() {
        var colors = new Array (
            ['#FF8080', '#FFFF80', '#80FF80', '#00FF80', '#80FFFF', '#0080FF', '#FF80C0', '#FF80FF'],
            ['#FF0000', '#FFFF00', '#80FF00', '#00FF40', '#00FFFF', '#0080C0', '#8080C0', '#FF00FF'],
            ['#804040', '#FF8040', '#00FF00', '#008080', '#004080', '#8080FF', '#800040', '#FF0080'],
            ['#800000', '#FF8000', '#008000', '#008040', '#0000FF', '#0000A0', '#800080', '#8000FF'],
            ['#400000', '#804000', '#004000', '#004040', '#000080', '#000040', '#400040', '#400080'],
            ['#000000', '#808000', '#808040', '#808080', '#408080', '#C0C0C0', '#400040', '#FFFFFF']
        );
        var table = document.getElementById("colortable");

        for (itr in colors) {
            var row = table.insertRow(-1);
            for (itd in colors[itr]) {
                var cell = row.insertCell(-1);
                cell.height = 17;
                cell.innerText = "";
                cell.bgColor = colors[itr][itd];

                //when move mouse to a cell, the selected color will changed
                cell.onmouseover = function() {
                    var colorcode = document.getElementById("colorcode");
                    colorcode.innerHTML = "<b>" + this.bgColor.toUpperCase() + "</b>";
                    var selectedcolor = document.getElementById("selectedcolor");
                    selectedcolor.bgColor = this.bgColor;
                    selected = selectedcolor;
                }
                //when mouse click, the selected color will be assigned to obj
                //and color palette will be closed
                cell.onclick  = function(){
                    if (objId != '') {
                        var obj = document.getElementById(objId);
                    }
                    obj.value = selected.bgColor.toUpperCase();
                    if (obj.onchange) {
                        obj.onchange();
                    }
                    onClickPalette('', null);
                    preview();
                };
            }
        }
    }


    //It is called when mouse over transparent cell
    function onTransparent() {
        var colorcode = document.getElementById("colorcode");
        colorcode.innerHTML = "<b>" + transparent + "</b>";
        var selectedcolor = document.getElementById("selectedcolor");
        selectedcolor.bgColor = "Transparent";
    }


    //It is called when mouseclick on transparent cell
    function onClickTransparent() {
        if (objId != '') {
            var obj = document.getElementById(objId);
        }
        obj.value = 'TRANSPARENT';
        onClickPalette('', null);
    }

    //show or hide the palette
    //it also inits table data and div position
    function onClickPalette(objid, control, isTran, leftTopDisplay) {
        if (!document.all && onchangeFlag) {
            return;
        }
        var l = 0;
        var t = 0;
        var obj;
        if (objid != '') {
            obj = document.getElementById(objid);
            objId = objid;
        }

        //check that needs the transparent or not
        var transparent = document.getElementById("transparent");
        if (typeof(isTran) != "undefined") {
            transparent.style.visibility = (isTran) ? "inherit" : "hidden";
        }
        else {
            transparent.style.visibility = "hidden";
        }

        //calculate the control position
        if (control != null) {
            controlTop = control.offsetTop;
            controlLeft = control.offsetLeft + 20;
            while(control = control.offsetParent) {
                controlTop += control.offsetTop;
                controlLeft += control.offsetLeft;
            }
        }

        //init div position
        var div = document.getElementById('colorlayer');
        if (leftTopDisplay != null) {
            leftDistance = controlLeft - div.offsetWidth;
            topDistance = controlTop - div.offsetHeight;
            div.style.left = leftDistance + "px";
            div.style.top = topDistance + "px";
        }
        else {
            div.style.left = controlLeft + "px";
            div.style.top = controlTop + "px";
        }

        //init div data
        if (div.style.visibility == 'hidden') {
            var selectedcolor = document.getElementById('selectedcolor');
            selectedcolor.bgColor = obj.value;
            var colorcode = document.getElementById('colorcode');
            colorcode.innerHTML = "<b>" + obj.value.toUpperCase() + "</b>";
        }

        div.style.visibility = (div.style.visibility == 'hidden') ? 'visible' : 'hidden';
    }

    var inColorPalette = false;
    function mousedown() {
        if (!inColorPalette) {
            var div = document.getElementById('colorlayer');
            div.style.visibility = 'hidden';
        }
    }

    function leaveColorPalette() {
        inColorPalette=false;
    }

    function enterColorPalette() {
        inColorPalette=true;
    }

    document.onmousedown = mousedown;

-->
</script>
<form id="basicLayout" action="" method="post" class="tight-layout">
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="admob-Height">
    <tr>
        <td valign="top" align="center">
        <table border="0" align="center" cellpadding="0" cellspacing="0" class="admob-Height" width="90%">
            <tr>
            <td width="244" valign="top">
                <table width="100%" border="0" cellpadding="0" cellspacing="0" class="admob-Height">
                <tr>
                <td width="14" valign="top">&nbsp;</td>
                <td valign="top">
                    <table width="100%" border="0" cellpadding="0" cellspacing="0" class="admob-Height">
                    <tr>
                        <td>
                        <select id="adspaceName" name="adspace_name" class="admob-CustomizeSmallDropDown">
                        <?php
                        $sqlName = "select m.adspaceid, m.adspacename, d.adspacetype from adspace_master m
                                    inner join (select adSpaceId, adspaceType from adspace_details) d
                                    on m.adspaceid = d.adspaceid
                                    where m.adspacename <>'' and userid='".$_SESSION['siteuserId']."' and m.adsiteid='".$_REQUEST['sid']."'
                                    order by m.readydate desc";
                        $recName = mysql_query($sqlName);
                        while($row_adname=mysql_fetch_array($recName)){
                        ?>
                            <option id="<?php echo $row_adname['adspaceid']; ?>" value="<?php echo $row_adname['adspacetype']; ?>"><?php echo $row_adname['adspacename']; ?></option>
                        <?php
                        }
                        ?>
                        </select>
                        </td>
                    </tr>
                    <tr class="textAd" datafld="text" style="display: none;">
                        <td width="35%" valign="top">
                        <table width="100%" border="0" cellpadding="0" cellspacing="0" class="admob-Height">
                        <tr>
                        <td valign="top">
                            <table width="100%" border="0" cellspacing="0" cellpadding="0">
                            <tr>
                            <td class="admob-SquareBoxTilteBg">Ad Space Characteristics</td>
                            </tr>
                            <tr>
                            <td class="admob-SquareBoxBorder">
                            <table width="100%" border="0" cellpadding="0" cellspacing="2" class="admob-FormContent">
                            <tr>
                                <td width="150" height="25"><strong>Ad Space Type:</strong></td>
                                <td>
                                    <select id="adspaceType" name="adspace_type" class="admob-CustomizeSmallDropDown" onChange="var newValue=this.value;this.selectedIndex=0;window.location.href=newValue;">
                                    <option value="text" selected="selected" onClick="window.location='customize_ad.php'">Text</option>
                                    <option value="banner" onClick="window.location='customize_banner.php'">Banner</option>
                                    <option value="thumbnail" onClick="window.location='customize_thumbnail.php'">Thumbnail</option>
                                    <option value="customize_commBreak" onclick="window.location='customize_commBreak.php'">Commercial Break</option>
                                    </select>
                                </td>
                            </tr>
                            <script type="text/javascript" language="javascript" src="selling-basic-adspace-add_files/js.html"></script>
                            <script type="text/javascript" language="javascript" src="selling-basic-adspace-add_files/form.js"></script>
                            <tr>
                                <td height="25">#Ads:</td>
                                <td>
                                    <select id="cellCount" name="cell_count" class="admob-CustomizeDropDown" onChange="javascript: preview();">
                                        <option label="1" value="1" selected="selected">1</option>
                                        <option label="2" value="2">2</option>
                                        <option label="3" value="3">3</option>
                                        <option label="4" value="4">4</option>
                                        <option label="5" value="5">5</option>
                                        <option label="6" value="6">6</option>
                                        <option label="7" value="7">7</option>
                                        <option label="8" value="8">8</option>
                                        <option label="9" value="9">9</option>
                                        <option label="10" value="10">10</option>
                                        <option label="11" value="11">11</option>
                                        <option label="12" value="12">12</option>
                                        <option label="13" value="13">13</option>
                                        <option label="14" value="14">14</option>
                                        <option label="15" value="15">15</option>
                                        <option label="16" value="16">16</option>
                                        <option label="17" value="17">17</option>
                                        <option label="18" value="18">18</option>
                                        <option label="19" value="19">19</option>
                                        <option label="20" value="20">20</option>
                                    </select>
                                </td>
                            </tr>
                            <!--######################### code on 29_06_09 starts####################-->
                            <tr>
                                <td height="25%">#Ads Type:</td>
                                <td>
                                    <select id="ad_Type" name="ad_Type" class="admob-CustomizeDropDownBig">
                                        <option label="direct" value="direct" selected="selected">Direct</option>
                                        <option label="network" value="network">Network</option>
                                    </select>
                                </td>
                            </tr>
                            <!--######################### code on 29_06_09 ends #####################-->
                            <tr>
                                <td height="40%">View:</td>
                                <td>
                                    <div id="horizontalView"><input id="horizontal" name="alignment" value="horizontal" onClick="javascript: preview();" type="radio"><label for="horizontal">Horizontal</label></div>
                                    <div id="verticalView"><input id="vertical" name="alignment" value="vertical" checked="checked" onClick="javascript: preview();" type="radio"><label for="vertical">Vertical</label></div>
                                </td>
                            </tr>
                            <tr>
                                <td height="25%">Standard Size:</td>
                                <td>
                                <select id="size" name="size" class="admob-CustomizeLargeDropDown" onChange="javascript: if('160x100'==this.value)restoreDefaultSize();else preview();">
                                    <option label="None" value="160x100" selected="selected">None</option>
                                    <option label="Standard Rectangle (184 x 360)" value="184x360">Standard Rectangle (184 x 360)</option>
                                    <option label="Full Banner (468 x 60)" value="468x60">Full Banner (468 x 60)</option>
                                    <option label="Half Banner (234 x 60)" value="234x60">Half Banner (234 x 60)</option>
                                    <option label="Leader Board (728 x 90)" value="728x90">Leader Board (728 x 90)</option>
                                    <option label="Square Button (125 x 125)" value="125x125">Square Button (125 x 125)</option>
                                    <option label="Vertical Banner (120 x 240)" value="120x240">Vertical Banner (120 x 240)</option>
                                    <option label="Small Rectangle (180 x 150)" value="180x150">Small Rectangle (180 x 150)</option>
                                    <option label="Medium Rectangle (300 x 250)" value="300x250">Medium Rectangle (300 x 250)</option>
                                    <option label="Large Rectangle (336 x 280)" value="336x280">Large Rectangle (336 x 280)</option>
                                    <option label="Square Pop-up (250 x 250)" value="250x250">Square Pop-up (250 x 250)</option>
                                    <option label="Skyscraper (120 x 600)" value="120x600">Skyscraper (120 x 600)</option>
                                    <option label="Wide Skyscraper (160 x 600)" value="160x600">Wide Skyscraper (160 x 600)</option>
                                </select>
                                </td>
                            </tr>
                            <tr>
                            <td height="25%">Font Type:</td>
                            <td>
                                <select id="fontType" name="font_type" class="admob-CustomizeDropDownBig" onChange="javascript: preview();">
                                    <option label="Arial" value="Arial" selected="selected">Arial</option>
                                    <option label="Georgia" value="Georgia">Georgia</option>
                                    <option label="Sans-serif" value="MS Sans Serif">Sans-serif</option>
                                    <option label="Times" value="Times">Times</option>
                                    <option label="Verdana" value="Verdana">Verdana</option>
                                </select>
                            </td>
                            </tr>
                            <tr>
                            <td height="25%">Background Color:</td>
                            <td>
                                <input id="backgroundColor" name="background_color" class="admob-CustomizeInputBox" size="10" maxlength="11" value="#E8E8E8" onChange="javascript: commonPreview(preview);" type="text"><a class="colorformat">Background Color</a><img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="Palette" onClick="javascript: onClickPalette('backgroundColor', this, true);">
                            </td>
                            </tr>
                            <tr>
                            <td height="25%">Headline Color:</td>
                            <td>
                                <input id="titleColor" name="title_color" class="admob-CustomizeInputBox" size="10" maxlength="10" value="#0000FF" onChange="javascript: commonPreview(preview);" type="text"><a class="colorformat">Headline Color</a><img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="Palette" onClick="javascript: onClickPalette('titleColor', this);">
                            </td>
                            </tr>
                            <tr>
                            <td height="25%">Description Color:</td>
                            <td>
                                <input id="descriptionColor" name="description_color" class="admob-CustomizeInputBox" size="10" maxlength="10" value="#000000" onChange="javascript: commonPreview(preview);" type="text"><a class="colorformat">Description Color</a><img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="Palette" onClick="javascript: onClickPalette('descriptionColor', this);">
                            </td>
                            </tr>
                            <tr>
                            <td height="25%">Hide Broker Link:</td>
                            <td>
                                <select id="brokerLinkHide" name="broker_link_hide" class="admob-CustomizeDropDown" onChange="javascript: hideBrokerLink(); preview();">
                                    <option value="No" selected="selected">No</option>
                                    <option value="Yes">Yes</option>
                                </select><br />
                                <a href="javascript: restoreDefault();" class="admob-RightLink">restore defaults</a></td>
                            </tr>
                            </table>
                            </td>
                            </tr>
                            <script language="javascrip" type="text/javascript">
                            var message_warning_not_allow_network = "Warning! Network ads allow this ad space to always generate revenue, regardless of a direct ad purchase. If you choose to continue, please set your desired sale price for this ad space.";
                            function checkSelect(obj) {
                                if (false == obj.checked) {
                                    if(!confirm(message_warning_not_allow_network)) {
                                        obj.checked = true;
                                    }
                                }
                            }
                            </script>
                            <tr>
                                <td>&nbsp;</td>
                                <td>&nbsp;</td>
                            </tr>
                            <tr>
                                <td height="25">&nbsp;</td>
                                <td>
                                <table border="0" align="left" cellpadding="0" cellspacing="0">
                                <tr>
                                    <td>
                                        <input id="customAdSpace" name="custom_adspace" value="" disabled="disabled" type="hidden">
                                        <!--<input name="back" value="&lt; Back" class="admob-InputButton" onClick="javascript: window.location.href='#'" type="button">-->
                                    </td>
                                    <td width="10">&nbsp;</td>
                                    <td>
                                        <input name="save" value="Save" class="admob-InputButton" onClick="javascript: return validateSite(); " type="submit">
                                    </td>
                                </tr>
                                </table>
                                </td>
                            </tr>
                            </table>
                        </td>
                       </tr>
                       </table>
                       </td>
                        <td width="13" valign="top">&nbsp;</td>
                        <td width="60%" valign="top">
                           <table width="100%" border="0" cellspacing="0" cellpadding="0">
                           <tr>
                                <td class="admob-SquareBoxTilteBg">Preview</td>
                           </tr>
                           <tr>
                                <td class="admob-SquareBoxBorder">
                                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                                <tr>
                                <td>
                                <div style="padding: 3px; text-align: left;">
                                <table>
                                <tbody><tr id="pTr">
                                <td id="pTd">
                                <table style="width: 640px; height: 79px; table-layout: fixed;" border="0" cellpadding="6" cellspacing="6">
                                <tbody>
                                <!--<tr><td align="center" bgcolor="#ff8080" valign="top"><div style="overflow: hidden; width: 141px; height: 55px;" id="ad_0"><div style="color: rgb(0, 0, 255); font-family: Arial; font-size: 13px; font-weight: bold; text-decoration: underline;">Headline Goes Here</div><div style="color: rgb(0, 0, 0); font-family: Arial; font-size: 13px;">Ad description will go ...</div></div></td><td align="center" bgcolor="#ff8080" valign="top"><div style="overflow: hidden; width: 141px; height: 55px;" id="ad_1"><div style="color: rgb(0, 0, 255); font-family: Arial; font-size: 13px; font-weight: bold; text-decoration: underline;">Headline Goes Here</div><div style="color: rgb(0, 0, 0); font-family: Arial; font-size: 13px;">Ad description will go ...</div></div></td><td align="center" bgcolor="#ff8080" valign="top"><div style="overflow: hidden; width: 141px; height: 55px;" id="ad_2"><div style="color: rgb(0, 0, 255); font-family: Arial; font-size: 13px; font-weight: bold; text-decoration: underline;">Headline Goes Here</div><div style="color: rgb(0, 0, 0); font-family: Arial; font-size: 13px;">Ad description will go ...</div></div></td><td align="center" bgcolor="#ff8080" valign="top"><div style="overflow: hidden; width: 141px; height: 55px;" id="ad_3"><div style="color: rgb(0, 0, 255); font-family: Arial; font-size: 13px; font-weight: bold; text-decoration: underline;">Headline Goes Here</div><div style="color: rgb(0, 0, 0); font-family: Arial; font-size: 13px;">Ad description will go ...</div></div></td></tr>-->
                                </tbody></table></td>
                                </tr>
                                <tr>
                                <td style="text-align: left; height: 15px;">
                                  <div id="brokerLink" style="border-width: 0px; display: inline; font-size: 11px; font-family: arial; color: rgb(0, 0, 0); text-decoration: none; font-weight: normal; font-style: normal;"><a href="#" class="admob-RightLink"><span id="brokerLinkSpan">Advertise Here</span></a></div>
                                </td>
                                </tr>
                                </tbody>
                                </table>
                                <script language="javascript" type="text/javascript">
                                var confirm_hide_link = "Are you sure? If you hide the link, people will not be able to advertise on your site or become your affiliate.";
                                var descriptionString = "Ad description will go here below the Headline.";
                                var titleString = "Headline Goes Here";
                                var descString = "Ad description will go here.";
                                </script>
                                <script language="javascript" type="text/javascript">
                                function showWarning(isOverflow) {
                                    warning.style.display = isOverflow ? 'block' : 'none';
                                }

                                function hideBrokerLink(){
                                   if ("Yes" == document.getElementById("brokerLinkHide").value) {
                                       if (!window.confirm(confirm_hide_link)) {
                                           document.getElementById("brokerLinkHide").value = "No";
                                       }
                                   }
                                }

                                function restoreDefault() {
                                    if (!document.all && onchangeFlag) {
                                        return;
                                    }
                                    if (null != document.getElementById("siteId")) {
                                        document.getElementById("siteId").options[0].selected = true;
                                        changeRating();
                                    }
                                    document.getElementById("size").options[0].selected = true;
                                    document.getElementById("vertical").checked = true;
                                    document.getElementById("cellCount").options[0].selected = true;
                                    document.getElementById("backgroundColor").value = "#E8E8E8";
                                    document.getElementById("titleColor").value = "#0000FF";
                                    document.getElementById("descriptionColor").value = "#000000";
                                    document.getElementById("fontType").value = "Arial";
                                    document.getElementById("brokerLinkHide").options[0].selected = true;
                                    preview();
                                }

                                function restoreDefaultSize() {
                                    document.getElementById("cellCount").options[0].selected = true;
                                    document.getElementById("vertical").checked = true;
                                    preview();
                                }

                                function preview() {
                                    var elementTitleColor = document.getElementById("titleColor");
                                    var elementDescriptionColor = document.getElementById("descriptionColor");
                                    var elementBgColor = document.getElementById("backgroundColor");
                                    var reg = /^#[0-9a-fA-F]{6}$/;
                                    if ('TRANSPARENT' != elementBgColor.value && ! reg.test(elementBgColor.value)) {
                                        alert(alert_color_incorrect.replace('<field name>', elementBgColor.nextSibling.firstChild.nodeValue));
                                        focusElement(elementBgColor);
                                        return;
                                    }
                                    if (! reg.test(elementTitleColor.value)) {
                                        alert(alert_color_incorrect.replace('<field name>', elementTitleColor.nextSibling.firstChild.nodeValue));
                                        focusElement(elementTitleColor);
                                        return;
                                    }
                                    if (! reg.test(elementDescriptionColor.value)) {
                                        alert(alert_color_incorrect.replace('<field name>', elementDescriptionColor.nextSibling.firstChild.nodeValue));
                                        focusElement(elementDescriptionColor);
                                        return;
                                    }
                                    var fontName = document.getElementById("fontType").value;
                                    var titleColor = document.getElementById("titleColor").value;
                                    var descriptionColor = document.getElementById("descriptionColor").value;
                                    var bgColor = document.getElementById("backgroundColor").value;
                                    var size = document.getElementById("size").value;
                                    document.getElementById("horizontal").disabled = true;
                                    document.getElementById("vertical").disabled = true;
                                    document.getElementById("cellCount").disabled = true;
                                    var alignment = "vertical";
                                    var titleFontSize = "13px";
                                    var descriptionFontSize = "13px";
                                    var titleText = titleString;
                                    var descriptionText = descriptionString;
                                    cellSpacing = 6;
                                    cellPadding = 6;
                                    rows = 1;
                                    cols = 1;
                                    sizes = size.split("x");
                                    totalWidth = sizes[0];
                                    totalHeight = sizes[1];

                                    switch (size) {
                                        case "184x360" :
                                            ads = 5;
                                            rows = 5;
                                            descriptionFontSize = "12px";
                                            break;
                                        case "468x60" :
                                            ads = 2;
                                            cellSpacing = 6;
                                            alignment = "horizontal";
                                            cols = 2;
                                            titleFontSize = "12px";
                                            descriptionFontSize = "11px";
                                            break;
                                        case "234x60" :
                                            ads = 1;
                                            cellSpacing = 6;
                                            titleFontSize = "12px";
                                            descriptionFontSize = "12px";
                                            break;
                                        case "728x90" :
                                            ads = 5;
                                            alignment = "horizontal";
                                            cols = 5;
                                            descriptionFontSize = "12px";
                                            descriptionText = descString;
                                            break;
                                        case "125x125" :
                                            ads = 1;
                                            cellSpacing = 0;
                                            titleFontSize = "12px";
                                            descriptionFontSize = "12px";
                                            break;
                                        case "120x240" :
                                            ads = 3;
                                            rows = 3;
                                            titleFontSize = "12px";
                                            descriptionFontSize = "12px";
                                            descriptionText = descString;
                                            break;
                                        case "180x150" :
                                            ads = 1;
                                            titleFontSize = "12px";
                                            descriptionFontSize = "12px";
                                            break;
                                        case "300x250" :
                                            ads = 4;
                                            cols = 2;
                                            rows = 2;
                                            break;
                                        case "336x280" :
                                            ads = 6;
                                            cols = 3;
                                            rows = 2;
                                            break;
                                        case "250x250" :
                                            ads = 4;
                                            cols = 2;
                                            rows = 2;
                                            break;
                                        case "120x600" :
                                            ads = 6;
                                            rows = 6;
                                            break;
                                        case "160x600" :
                                            ads = 7;
                                            rows = 7;
                                            break;
                                        default :
                                            document.getElementById("horizontal").disabled = false;
                                            document.getElementById("vertical").disabled = false;
                                            document.getElementById("cellCount").disabled = false;
                                            ads = document.getElementById("cellCount").value;
                                            cellSpacing = 6;
                                            if (document.getElementById("horizontal").checked) {
                                                alignment = "horizontal";
                                                cols = parseInt(ads);
                                            }
                                            else {
                                                rows = parseInt(ads);
                                            }
                                            width = sizes[0];
                                            height = sizes[1];
                                            totalWidth = width*cols;
                                            totalHeight = height*rows;
                                            break;
                                    }

                                    if ("vertical" == alignment) {
                                        document.getElementById("vertical").checked = true;
                                    }
                                    else {
                                        document.getElementById("horizontal").checked = true;
                                    }

                                    if ("No" == document.getElementById("brokerLinkHide").value) {
                                        totalHeight -= 21;
                                    }
                                    temp = cellPadding * (rows * 2) + cellSpacing * (rows + 1);
                                    height = Math.round((totalHeight - temp)/rows);
                                    temp = cellPadding * (cols * 2) + cellSpacing * (cols + 1);
                                    width = Math.round((totalWidth - temp)/cols);

                                    document.getElementById("cellCount").value = ads;
                                    document.getElementById("pTd").innerHTML = "";
                                    previewTable = document.createElement("TABLE");
                                    previewTableBody = document.createElement("TBODY");
                                    var index = 0;
                                    var ad_elements = new Array();
                                    for(j = 0; j < rows; j++) {
                                        currentRow = document.createElement("TR");
                                        for(i = 0; i < cols;i++) {
                                            currentCell = document.createElement("TD");
                                            if ("" != bgColor) {
                                                currentCell.bgColor = bgColor;
                                            }
                                            currentCell.vAlign = "top";
                                            currentCell.align = "center";
                                            content = document.createElement("DIV");
                                            content.id = "ad_" + index;
                                            ad_elements[index++] = content;
                                            content.style.overflow = "hidden";
                                            content.style.width = width + "px";
                                            content.style.height = height + "px";
                                            title = document.createElement("DIV");
                                            title.style.color = titleColor;
                                            title.style.fontFamily = fontName;
                                            title.style.fontSize = titleFontSize;
                                            title.style.fontWeight = "bold";
                                            title.style.textDecoration = "underline";
                                            titleContent = document.createTextNode(titleString);
                                            title.appendChild(titleContent);

                                            description = document.createElement("DIV");
                                            description.style.color = descriptionColor;
                                            description.style.fontFamily = fontName;
                                            description.style.fontSize = descriptionFontSize;
                                            descriptionContent = document.createTextNode(descriptionText);
                                            description.appendChild(descriptionContent);
                                            content.appendChild(title);
                                            content.appendChild(description);
                                            currentCell.appendChild(content);
                                            currentRow.appendChild(currentCell);
                                        }
                                        previewTableBody.appendChild(currentRow);
                                    }

                                    var brokerLinkElement = document.getElementById("brokerLink");

                                    if ("No" == document.getElementById("brokerLinkHide").value) {
                                        brokerLinkElement.style.display = "inline";
                                    }
                                    else {
                                        brokerLinkElement.style.display = "none";
                                    }
                                    previewTable.brokerLinkSpan = document.getElementById('brokerLinkSpan');
                                    previewTable.totalWidth = totalWidth;
                                    previewTable.appendChild(previewTableBody);
                                    previewTable.setAttribute("border", "0");
                                    previewTable.cellSpacing = cellSpacing;
                                    previewTable.cellPadding = cellPadding;
                                    previewTable.style.width = totalWidth + "px";
                                    previewTable.style.height = totalHeight + "px";
                                    previewTable.style.tableLayout = "fixed";

                                    document.getElementById("pTd").appendChild(previewTable);
                                    var striped = stripAllContents(ad_elements);
                                    if ("No" == document.getElementById("brokerLinkHide").value) {
                                        striped |= stripBrokerLink(previewTable);
                                    }

                                    if (isIE7()) {
                                        controlIE7Performance();
                                    }

                                    showWarning(striped);
                                    if ('undefined' != typeof(isChanged)){
                                       isChanged = true;
                                    }
                                }

                                var oldOnload = window.onload;
                                window.onload = function() {
                                    if (oldOnload) {
                                        oldOnload();
                                    }
                                    warning = document.createElement('div');
                                    warning.style.display = 'none';
                                    var previewTable = document.getElementById("pTable");
                                    //previewTable.parentNode.insertBefore(warning, previewTable);

                                    preview();
                                    if ('undefined' != typeof(isChanged)){
                                       isChanged = false;
                                       addLinksCheckChange(leave_message);
                                    }
                                }
                                </script>
                                </div>
                                </td>
                                </tr>
                                </tbody>
                                </table>
                                </td>
                            </tr>
                            </tbody>
                            </table>
                        </td>
                    </tr>
                    <tr class="bannerAd" datafld="banner" style="display: none;">
                        <td style="width: 50%;">
                        <table style="background-color: rgb(153, 153, 153); width: 100%;" cellpadding="3" cellspacing="1" class="mainTable">
                        <tbody>
                            <tr>
                                <td style="text-align: left; color: rgb(255, 255, 255); font-weight: bold;" class="sitename">Ad Space Characteristics</td>
                            </tr>
                        <tr style="background-color: rgb(251, 251, 251);">
                        <td>
                            <div style="padding: 3px; text-align: left;">
                            <table style="text-align: left;"  align="center" width="100%">
                            <tbody>
                            <tr>
                                <td colspan="2" class="blackbold" style="text-align: left;">Ad Space Type:
                                    <select id="adspaceType" name="adspace_type" class="flat blackbold" disabled>
                                        <option value="banner" selected="selected">Banner</option>
                                    </select>
                                </td>
                            </tr>
                            <tr>
                            <tr>
                                <td>Size:</td>
                                <td>
                                    <select id="sizeB" name="sizeB" onChange="javascrip: previewB();window.changed = true;">
                                        <option label="Vertical Banner (120 x 240)" value="120x240" selected="selected">Vertical Banner (120 x 240)</option>
                                        <option label="Mini Skyscraper(120 x 400)" value="120x400">Mini Skyscraper(120 x 400)</option>
                                        <option label="Skyscraper (120 x 600)" value="120x600">Skyscraper (120 x 600)</option>
                                        <option label="Square Button (125 x 125)" value="125x125">Square Button (125 x 125)</option>
                                        <option label="Wide Skyscraper1 (150 x 600)" value="150x600">Wide Skyscraper1 (150 x 600)</option>
                                        <option label="Wide Skyscraper2 (160 x 600)" value="160x600">Wide Skyscraper2 (160 x 600)</option>
                                        <option label="Wide Skyscraper3 (200 x 480)" value="200x480">Wide Skyscraper3 (200 x 480)</option>
                                        <option label="Square (250 x 250)" value="250x250">Square (250 x 250)</option>
                                        <option label="Medium Rectangle (300 x 250)" value="300x250">Medium Rectangle (300 x 250)</option>
                                        <option label="Medium Rectangle 2 (300 x 210)" value="300x210">Medium Rectangle 2 (300 x 210)</option>
                                        <option label="Medium Rectangle 3 (400 x 250)" value="400x250">Medium Rectangle 3 (400 x 250)</option>
                                        <option label="Full Banner (468 x 60)" value="468x60">Full Banner (468 x 60)</option>
                                        <option label="Leader Board (728 x 90)" value="728x90">Leader Board (728 x 90)</option>
                                        <option label="Large Leader Board (728 x 300)" value="728x300">Large Leader Board (728 x 300)</option>
                                        <option label="Large Leader Board 2 (768 x 245)" value="768x245">Large Leader Board 2 (768 x 245)</option>
                                    </select>
                                </td>
                            </tr>
                            <!--######################### code on 25_07_09 starts####################-->
                            <tr>
                                <td>#Ads Type:</td>
                                <td>
                                    <select id="ad_Type" name="ad_Type" class="flat">
                                        <option label="direct" value="direct" selected="selected">Direct</option>
                                        <option label="network" value="network">Network</option>
                                    </select>
                                </td>
                            </tr>
                            <!--######################### code on 25_07_09 ends #####################-->
                            <tr>
                                <td colspan="2"><div style="font-weight: bold; color: rgb(0, 0, 0);">Template Appearance</div></td>
                            </tr>
                            <tr>
                                <td colspan="2"><input id="use_template" name="template_setting" value="off" onClick="setTemplateAppearance(false);" checked="true" type="radio">
                                <label for="use_template">Use Template Setting</label></td>
                            </tr>
                            <tr>
                                <td colspan="2"><input id="config_appearance" name="template_setting" value="on" onClick="setTemplateAppearance(true);" type="radio">
                                <label for="config_appearance">Configure Appearance</label></td>
                            </tr>
                            </tbody>
                            </table>
                            <table id="configAppearanceTable" style="width: 330px; display: none;">
                            <tbody>
                            <tr>
                                <td style="width: 29%;">Background Color:</td>
                                <td style="width: 36%;"><input id="backgroundColor" name="background_color" class="flat" size="10" maxlength="10" value="" onChange="window.changed = true;changeStyle('color', this, 'previewBackgroundColor');" type="text">
                                <a class="">Background Color</a><img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="label_text_palette" onClick="javascript: onClickPalette('backgroundColor', this, false);"></td>
                                <td style="width: 35%;"><div id="previewBackgroundColor" style="height: 18px;"></div></td>
                            </tr>
                            <tr>
                                <td colspan="3">Header:</td>
                            </tr>
                            <tr>
                                <td style="padding-left: 20px;">Font Type:</td>
                                <td colspan="2">
                                <select id="headerFontType" class="flat" name="header_font_type" onChange="window.changed = true;changeStyle('fontType', this, 'previewHeaderStyle');">
                                    <option label="Arial" value="Arial">Arial</option>
                                    <option label="Georgia" value="Georgia">Georgia</option>
                                    <option label="Sans-serif" value="MS Sans Serif">Sans-serif</option>
                                    <option label="Times" value="Times">Times</option>
                                    <option label="Verdana" value="Verdana">Verdana</option>
                                </select>
                                </td>
                            </tr>
                            <tr>
                            <td style="padding-left: 20px;">Color:</td>
                            <td><input id="headerColor" name="header_bg_color" class="flat" size="10" maxlength="10" value="" onChange="window.changed = true;changeStyle('color', this, 'previewHeaderStyle');" type="text">
                            <a class="">Color</a><img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="label_text_palette" onClick="onClickPalette('headerColor', this, false);"></td>
                            <td><div id="previewHeaderStyle" style="height: 18px; padding-left: 5px; font-family: arial;">Header Sample</div></td>
                            </tr>
                            <tr>
                            <td colspan="3">Body:</td>
                            </tr>
                            <tr>
                            <td style="padding-left: 20px;">Font Type:</td>
                            <td colspan="2"><select id="bodyFontType" class="flat" name="body_font_type" onChange="window.changed = true;changeStyle('fontType', this, 'previewBodyStyle');">
                            <option label="Arial" value="Arial">Arial</option>
                            <option label="Georgia" value="Georgia">Georgia</option>
                            <option label="Sans-serif" value="MS Sans Serif">Sans-serif</option>
                            <option label="Times" value="Times">Times</option>
                            <option label="Verdana" value="Verdana">Verdana</option>
                            </select></td>
                            </tr>
                            <tr>
                            <td style="padding-left: 20px;">Color:</td>
                            <td><input id="bodyColor" name="body_bg_color" class="flat" size="10" maxlength="10" value="" onChange="window.changed = true;changeStyle('color', this, 'previewBodyStyle');" type="text">
                            <a class="">Color</a><img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="label_text_palette" onClick="javascript: onClickPalette('bodyColor', this, false);"></td>
                            <td><div id="previewBodyStyle" style="height: 18px; padding-left: 5px; font-family: arial;">Body Sample</div></td>
                            </tr>
                            </tbody>
                            </table>
                            <div style="padding-top: 10px; padding-bottom: 10px; font-weight: bold;">Note:
                            If this banner ad space does not have a direct ad campaign running, a
                            banner template will be used that will display text ads, thumbnail ads
                            and/or banner ads from our network.</div>
                            </div>
                        </td>
                        </tr>
                        </tbody>
                        </table>
                        <div style="text-align: right; padding-top: 10px;">
                        <input id="dimensionChanged" name="dimension_changed" value="false" type="hidden">
                        <!--<input name="back" value="Back" class="blank-button-small" onClick="javascript: void();" type="button">-->
                        <input name="save" value="Save" class="yellow-button-small" type="submit">
                        </div>
                        </td>
                        <td>&nbsp;</td>
                        <td style="width: 50%;">
                        <table style="background-color: rgb(153, 153, 153); width: 100%;" cellpadding="3" cellspacing="1">
                        <tbody>
                            <tr>
                                <td style="text-align: left; color: rgb(255, 255, 255); font-weight: bold;" class="sitename">Preview</td>
                            </tr>
                            <tr style="background-color: rgb(251, 251, 251);">
                                <td>
                                    <div style="padding: 3px; text-align: left;">
                                        <div id="bannerPreview">
                                            <div><img id="bannerImage" style="border: 1px solid rgb(127, 157, 185); width: 120px; height: 240px;" src="images/ad_test_120x240.jpg" alt="Banner Test" height="240" width="120"></div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                        </table>
                            <script language="javascript" type="text/javascript">
                        <!--
                        var confirm_hide_link = "Are you sure? If you hide the link, people will not be able to advertise on your site or become your affiliate.";
                        var alert_choose_website = "Please choose a website from the dropdown list";
                        var alert_same_header_color_and_background_color = "The background color and header color should not be the same.";
                        var alert_same_body_color_and_background_color = "The background color and body color should not be the same.";
                        var leave_message = "Do you want to save your changes?";
                        var image_path = "images/";
                        //var location_url = 'selling-adspace-list.php?sid=2d47b082c2e464ec257bb48468c0ddfb';
                        var old_size = "120x240";
                        var old_broker_hide = "No";
                        var confirm_edit_dimension_change = "The dimensions of this Ad Space have changed. If you are using Iframe Mode Ad Space Code, you will need to copy the new code and include it on your website in order for the dimensions appear correctly.";
                        var is_edit = false;

                        var changed = false;

                        function setTemplateAppearance(configAppearance) {
                            if (configAppearance) {
                                var configAppearanceTable = document.getElementById('configAppearanceTable');
                                configAppearanceTable.style.display = 'block';
                                var inputs = configAppearanceTable.getElementsByTagName('input');
                                for (var i = 0; i < inputs.length; i++) {
                                    if ('text' == inputs[i].type) {
                                        nextSibling = inputs[i].nextSibling;
                                        if ((nextSibling != null) && (nextSibling.nodeType == 1) && (nextSibling.tagName == "A")){
                                            nextSibling.className = 'colorformat';
                                        }
                                    }
                                }
                            }
                            else {
                                var configAppearanceTable = document.getElementById('configAppearanceTable');
                                configAppearanceTable.style.display = 'none';
                                var inputs = configAppearanceTable.getElementsByTagName('input');
                                for (var i = 0; i < inputs.length; i++) {
                                    if ('text' == inputs[i].type) {
                                        nextSibling = inputs[i].nextSibling;
                                        if ((nextSibling != null) && (nextSibling.nodeType == 1) && (nextSibling.tagName == "A")){
                                            nextSibling.className = '';
                                        }
                                    }
                                }
                            }
                        }

                        function changeStyle(type, srcElement, destElementName) {
                            if ('color' == type) {
                                var color = srcElement.value;
                                if ('backgroundColor' == srcElement.id) {
                                    document.getElementById('previewBackgroundColor').style.backgroundColor = color;
                                    document.getElementById('previewHeaderStyle').style.backgroundColor = color;
                                    document.getElementById('previewBodyStyle').style.backgroundColor = color;
                                }
                                else {
                                    document.getElementById(destElementName).style.color = color;
                                }
                            }
                            else if ('fontType' == type) {
                                var fontType = srcElement.value;
                                document.getElementById(destElementName).style.fontFamily = fontType;
                            }
                        }

                        function processBack() {
                            if (checkChange(changed, leave_message)) {
                                window.location.href = location_url;
                            }
                        }


                        function previewB() {
                            var image = document.getElementById("bannerImage");
                            var sizeObject = document.getElementById("sizeB");
                            var size = document.getElementById("sizeB").value;
                            var sizes = size.split("x");
                            var width = sizes[0];
                            var height = sizes[1];
                            image.style.width = width + "px";
                            image.style.height = height+ "px";
                            image.src = image_path + "ad_test_" + size + ".jpg";
                            if (isIE7()) {
                                controlIE7Performance();
                            }

                        }

                        function validate() {
                            var result = true;
                            var objSite = document.getElementById("siteId");
                            var result2 = true;
                            if (null != objSite) {
                                if ("0" == objSite.value) {
                                    alert(alert_choose_website);
                                    objSite.focus();
                                    return false;
                                }
                            }
                            result = validateForm(document.getElementById("bannerAdSpace"));
                            if (result == false) {
                                return false;
                            }
                            if (result && document.getElementById('config_appearance').checked) {
                                bgColor = document.getElementById('backgroundColor').value;
                                headerColor = document.getElementById('headerColor').value;
                                bodyColor = document.getElementById('bodyColor').value;
                                if (bgColor == headerColor) {
                                    alert(alert_same_header_color_and_background_color);
                                    document.getElementById('headerColor').focus();
                                    result = false;
                                }
                                else if (bgColor == bodyColor) {
                                    alert(alert_same_body_color_and_background_color);
                                    document.getElementById('bodyColor').focus();
                                    result = false;
                                }
                            }

                            return result && result2;
                        }
                        previewB();
                        if (document.getElementById('config_appearance').checked) {
                            setTemplateAppearance(true);
                        }

//                        var oldOnload = window.onload;
//                        window.onload = function() {
//                            if (oldOnload) {
//                                oldOnload();
//                            }
//                            if (isIE7()) {
//                                controlIE7Performance();
//                            }
//                            if (document.getElementById('config_appearance').checked) {
//                                setTemplateAppearance(true);
//                            }
//                        }
                        -->
                        </script>
                        </td>
                    </tr>
                    <tr class="thumbAd" datafld="thumbnail" style="display: none;">
                        <td style="width: 50%;">
                        <table style="background-color: rgb(153, 153, 153); width: 100%;" cellpadding="3" cellspacing="1">
                        <tbody>
                        <tr>
                            <td style="text-align: left; color: rgb(255, 255, 255); font-weight: bold;" class="sitename">Ad Space Characteristics</td>
                        </tr>
                        <tr style="background-color: rgb(251, 251, 251);">
                        <td>
                        <div style="padding: 3px; text-align: left;">
                        <script type="text/javascript" language="javascript" src="js.html"></script>
                        <script type="text/javascript" language="javascript" src="JavaScripts/form.js"></script>
                        <table style="text-align: left;" class="normal-table" align="center">
                        <tbody>
                        <tr>
                            <td colspan="2" class="blackbold" style="text-align: left;">
                                Ad Space Type:
                                <select id="adspaceType" name="adspace_type" class="flat blackbold" disabled>
                                    <option value="thumbnail" selected="selected">Thumbnail</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                          <td colspan="2" style="margin: 0px; padding: 0px;"><hr></td>
                        </tr>
                        <tr>
                            <td colspan="2">
                            <fieldset style="margin: 0px; padding: 0px;">
                                <legend style="padding: 0px 5px; margin-left: 5px;">Components</legend>
                                <table style="text-align: left; line-height: 18px;">
                                <tbody>
                                <tr>
                                    <td>
                                        <input id="component_handle" name="handle" checked="checked" onclick="javascript:isChanged = true;setComponent(this);" type="checkbox"><label style="cursor: pointer;" for="component_handle">Handle</label>
                                    </td>
                                    <td>
                                        <input id="component_age" name="age" checked="checked" onclick="javascript:isChanged = true;setComponent(this);" type="checkbox"><label style="cursor: pointer;" for="component_age">Age</label>
                                    </td>
                                    <td>
                                        <input id="component_location" name="location" checked="checked" onclick="javascript:isChanged = true;setComponent(this);" type="checkbox"><label style="cursor: pointer;" for="component_location">Location</label>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input id="component_headline" name="headline" checked="checked" onclick="javascript:isChanged = true;setComponent(this);" type="checkbox"><label style="cursor: pointer;" for="component_headline">Headline</label>
                                    </td>
                                    <td>
                                        <input id="component_image" name="image" checked="checked" onclick="javascript:isChanged = true;setComponent(this);" type="checkbox"><label style="cursor: pointer;" for="component_image">Image</label>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input style="display: none;" id="component_header" name="header" checked="checked" onclick="javascript:isChanged = true;setComponent(this);" type="checkbox"><label style="cursor: pointer; display: none;" for="component_header">Header</label>
                                    </td>
                                    <td></td>
                                </tr>
                                </tbody>
                                </table>
                                <script type="text/javascript" language="javascript">
                                //fixed bug #3888, Header checkbox shall only be available when it is off/unchecked
                                var headerComponent = document.getElementById('component_header');
                                if (headerComponent.checked) {
                                    headerComponent.style.display = 'none';
                                    headerComponent.nextSibling.style.display = 'none';
                                }
                                </script>
                            </fieldset>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2"><hr></td>
                        </tr>
                        <tr>
                            <td colspan="2">
                                <fieldset>
                                <legend style="padding: 0px 5px; margin-left: 5px;">Thumbs</legend>
                                <div style="padding: 3px;">
                                Size:
                                    <select class="flat" id="thumbSize" name="thumb_size" onchange="javascript:isChanged = true;setImageSize(this.value);">
                                        <option label="40x40" value="40x40">40x40</option>
                                        <option label="60x60" value="60x60" selected="selected">60x60</option>
                                        <option label="80x80" value="80x80">80x80</option>
                                        <option label="100x100" value="100x100">100x100</option>
                                        <option label="120x120" value="120x120">120x120</option>
                                        <option label="140x140" value="140x140">140x140</option>
                                        <option label="160x160" value="160x160">160x160</option>
                                    </select>&nbsp;&nbsp;&nbsp;&nbsp;
                                    View:
                                    <select class="flat" id="thumbCount" name="thumb_count" onchange="javascript:isChanged = true;previewer.setCount(this.value);">
                                        <option label="1" value="1">1</option>
                                        <option label="2" value="2">2</option>
                                        <option label="3" value="3">3</option>
                                        <option label="4" value="4" selected="selected">4</option>
                                        <option label="5" value="5">5</option>
                                        <option label="6" value="6">6</option>
                                        <option label="7" value="7">7</option>
                                        <option label="8" value="8">8</option>
                                        <option label="9" value="9">9</option>
                                        <option label="10" value="10">10</option>
                                    </select>
                                </div>
                                </fieldset>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2"><hr></td>
                        </tr>
                        <tr>
                            <td colspan="2">
                            <fieldset>
                            <legend style="padding: 0px 5px; margin-left: 5px;">Thumbnail Size (pixels)</legend>
                            <table style="width: 100%;">
                            <tbody>
                            <tr>
                                <td>Width:</td>
                                <td>
                                    <input id="width" name="width" class="flat" value="264" style="width: 80px; color: rgb(128, 128, 128);" readonly="readonly" onkeyup="javascript:isChanged = true;setSize(gtbWidthInputElement.value, gtbHeightInputElement.value);" type="text">
                                </td>
                                <td>Height:</td>
                                <td>
                                    <input id="height" name="height" class="flat" value="212" style="width: 80px; color: rgb(128, 128, 128);" readonly="readonly" onkeyup="javascript:isChanged = true;setSize(gtbWidthInputElement.value, gtbHeightInputElement.value);" type="text">
                                </td>
                            </tr>
                            <tr>
                                <td colspan="4">
                                    <input id="customGtbSize" name="custom_gtb_size" onclick="javascript:isChanged = true;enableCustomGtbSize(this);" type="checkbox">
                                    <label style="cursor: pointer;" for="customGtbSize">Custom Thumbnail Size</label>
                                </td>
                            </tr>
                            </tbody>
                            </table>
                            <script language="javascript" type="text/javascript">
                            <!--
                            function enableCustomGtbSize(checkBox) {
                                if (checkBox.checked) {
                                    gtbWidthInputElement.readOnly = false;
                                    gtbHeightInputElement.readOnly = false;
                                    gtbWidthInputElement.style.color = '#000000';
                                    gtbHeightInputElement.style.color = '#000000';
                                    setSize(gtbWidthInputElement.value, gtbHeightInputElement.value);
                                }
                                else {
                                    gtbWidthInputElement.readOnly = true;
                                    gtbHeightInputElement.readOnly = true;
                                    gtbWidthInputElement.style.color = '#808080';
                                    gtbHeightInputElement.style.color = '#808080';
                                    setSize();
                                }
                            }

                            function popupStyleWindow(id,inmode) {
                            header = document.getElementById('headerContentStyle');
                            body = document.getElementById('bodyContentStyle');
                            //borker = document.getElementById('brokerLinkStyle');

                            //closes all style windows first
                            header.style.display = 'none';
                            body.style.display = 'none';
                            //borker.style.display = 'none';

                            document.getElementById(id).style.display = '';

                            window.scrollTo(0, document.getElementById(id).offsetTop);
                            document.getElementById('insertmode').value = inmode;

                            }
                            var gtbWidthInputElement = document.getElementById('width');
                            var gtbHeightInputElement = document.getElementById('height');
                            var windowOnload = window.onload;
                            window.onload = function() {
                            if (windowOnload) {
                            windowOnload();
                            }
                            enableCustomGtbSize(document.getElementById('customGtbSize'));
                            }
                            -->
                            </script>
                            </fieldset>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2"><hr></td>
                        </tr>
                        <tr>
                            <td>Background Color:</td>
                            <td>
                                <input id="backgroundColor" name="background_color" class="flat" size="10" maxlength="11" value="#80FF00" onchange="javascript: isChanged = true;commonPreview(previewT);;" type="text"><a class="colorformat">Background Color</a>
                                <img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="Palette" onclick="javascript: onClickPalette('backgroundColor', this, true);">
                            </td>
                        </tr>
                        <tr>
                            <td>Orientation:</td>
                            <td>
                                <input id="horizontal" name="alignment" value="horizontal" checked="checked" onclick="javascript:isChanged = true;setView();" type="radio">
                                <label style="cursor: pointer;" for="horizontal">Horizontal</label>
                                <input id="vertical" name="alignment" value="vertical" onclick="javascript:isChanged = true;setView();" type="radio">
                                <label style="cursor: pointer;" for="vertical">Vertical</label>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2"><hr></td>
                        </tr>
                        <tr>
                            <td colspan="2">
                            <fieldset>
                            <legend>Thumbnail Appearance</legend>
                            <table cellpadding="0" cellspacing="0" width="100%">
                            <tbody>
                            <tr>
                                <td width="50%"></td>
                                <td width="50%"></td>
                            </tr>
                            <tr>
                                <td colspan="2">Click on banner or links below to control appearance.</td>
                            </tr>
                            <tr>
                                <td>
                                    <input type="hidden" name="insertmode" id="insertmode">
                                    <span style="cursor: pointer;" onclick="javascript:popupStyleWindow('headerContentStyle','insertheader')"><img src="images/a-b.gif" alt="">&nbsp;Header</span>
                                </td>
                                <td>
                                    <span style="cursor: pointer;" onclick="javascript:popupStyleWindow('bodyContentStyle','insertbody')"><img src="images/a-b.gif" alt="">&nbsp;Body</span>
                                </td>
                            </tr>
                            </tbody>
                            </table>
                            </fieldset>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2" style="text-align: center;">
                                <a href="javascript: restoreDefault(); void 0;">restore defaults</a>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2">
                                <div>
                                    <input id="allowNetwork" name="allow_network" checked="checked" onchange="javascript:isChanged = true;" onclick="checkSelect(this);" type="checkbox"><label style="padding-left: 5px;" for="allowNetwork" class="blackbold">Allow Network Ads</label>
                                </div>
                            </td>
                        </tr>
                        </tbody>
                        </table>
                        <script language="javascrip" type="text/javascript">
                        <!--
                        var message_warning_not_allow_network = "Warning! Network ads allow this ad space to always generate revenue, regardless of a direct ad purchase. If you choose to continue, please set your desired sale price for this ad space.";
                        function checkSelect(obj) {
                            if (false == obj.checked) {
                                if(!confirm(message_warning_not_allow_network)) {
                                    obj.checked = true;
                                }
                            }
                        }
                        -->
                        </script>
                        </div>
                        </td>
                        </tr>
                        </tbody>
                        </table>
                        <div style="text-align: right; padding-top: 10px;">
                            <input id="gtbAdSpace" name="gtb_adspace" value="" disabled="disabled" type="hidden">
                            <!--<input name="back" value="&lt; Back" class="blank-button-small" onclick="javascript:void();" type="button">-->
                            <input name="save" value="Save &gt;" class="yellow-button-small" onclick="javascript: return validateSite(); " type="submit">
                        </div>
                        </td>
                        <td>&nbsp;</td>
                        <td style="width: 50%;">
                        <table style="background-color: rgb(153, 153, 153);" cellpadding="3" cellspacing="1" width="100%">
                        <tbody>
                        <tr>
                            <td style="text-align: left; color: rgb(255, 255, 255); font-weight: bold;" class="sitename">Preview</td>
                        </tr>
                        <tr style="background-color: rgb(251, 251, 251);">
                            <td>
                            <div style="padding: 3px; text-align: left;">
                            <div>
                                <script type="text/javascript" language="javascript" src="js.html"></script>
                                <script type="text/javascript" src="JavaScripts/gtb-previewer.js"></script>
                                <script type="text/javascript">
                                <!--
                                var title = "Header Goes Here";
                                var titleField = false;
                                if ((titleField = document.getElementById('headline'))
                                        && (titleField.type) && ('text' == titleField.type)
                                        && ('' != titleField.value)) {
                                    title = titleField.value;
                                }

                                var ad = {
                                    //requestURL: 'show-gallery-entry.php',
                                    spacer: 'images/spacer.gif',
                                    //baseURL: '?sid=2d47b082c2e464ec257bb48468c0ddfb',
                                    space: {
                                        rating: 'sfw',
                                        themeId: 1,
                                        style: {
                                                    cells: 4,
                                            view: 'horizontal',
                                            backgroundColor: '#6cdae7',
                                            imageWidth: 60,
                                            imageHeight: 60,
                                            showHandle:  true ,
                                            showAge:  true ,
                                            showLocation:  true ,
                                            showHeadline:  true ,
                                            showBrokerLink:  true ,
                                            showImage:  true ,
                                            showHeader:  true ,
                                            headStyle: 'fontFamily:Arial;fontSize:15px;color:#000000;textDecoration:none;fontWeight:bold;fontStyle:normal;textAlign:center',
                                            bodyStyle: 'fontFamily:Arial;fontSize:13px;color:#000000;textDecoration:none;fontWeight:normal;fontStyle:normal;textAlign:center',
                                //             brokerLinkStyle: 'fontFamily:Arial;fontSize:11px;color:#000000;textDecoration:none;fontWeight:normal;fontStyle:normal;textAlign:center'
                                        }
                                    },
                                    payment: {
                                        title: title
                                    },
                                    location: {
                                            //latitude: 22.5697,
                                       // longitude: 88.3697,
                                        //cityName: 'Calcutta',
                                            nearbyCities: []
                                    }
                                };

                                function setComponent(checkBox) {
                                    previewer.setComponent(checkBox.name, checkBox.checked);
                                }

                                function setImageSize(size) {
                                    size = size.toLowerCase().split('x');
                                    previewer.setImageSize(size[0], size[1]);
                                }

                                function setSize(width, height) {
                                    if (2 != arguments.length) {
                                        previewer.setSize();
                                    }
                                    else {
                                        previewer.setSize(width, height);
                                    }
                                }

                                function setView() {
                                    if (document.getElementById('horizontal').checked) {
                                        previewer.setView(GTBPreviewer.HORIZONTAL);
                                    }
                                    else {
                                        previewer.setView(GTBPreviewer.VERTICAL);
                                    }
                                }

                                function closeStyleWindow(id) {
                                    document.getElementById(id).style.display='none';
                                }

                                function editStyle(self, targetSytleEditId) {
                                    obj = document.getElementById(targetSytleEditId);

                                    var top;
                                    var left;
                                    var xOffset;
                                    var yOffset;
                                    var windowWidth;
                                    var windowHeight;

                                    var isIE = document.all ? true : false;

                                    if (isIE) {
                                        var htmlObj = document.getElementsByTagName('html')[0];
                                        left = event.x + htmlObj.scrollLeft;
                                        top = event.y + htmlObj.scrollTop;
                                        xOffset = event.x;
                                        yOffset = event.y;
                                        windowWidth = htmlObj.clientWidth;
                                        windowHeight = htmlObj.clientHeight;
                                    }
                                    else {
                                        document.captureEvents(Event.MOUSEMOVE);
                                        left = self.pageX;
                                        top = self.pageY;
                                        xOffset = self.pageX - window.scrollX;
                                        yOffset = self.pageY - window.scrollY;
                                        windowWidth = window.innerWidth - 20;
                                        windowHeight = window.innerHeight;
                                    }
                                    obj.style.top = top + "px";
                                    obj.style.left = left + "px";
                                    document.getElementById("headerContentStyle").style.display = "none";
                                    document.getElementById("bodyContentStyle").style.display = "none";
                                    document.getElementById("brokerLinkStyle").style.display = "none";
                                    obj.style.display = "";

                                    //adjusts the position of style window
                                    if (xOffset + obj.offsetWidth > windowWidth) {
                                        obj.style.left = left - obj.offsetWidth + "px";
                                    }

                                    if (yOffset + obj.offsetHeight > windowHeight) {
                                        obj.style.top = top - obj.offsetHeight + "px";
                                    }
                                }

                                function editHeadStyle(e) {
                                    editStyle(e, "headerContentStyle");
                                }

                                function editBodyStyle(e) {
                                    editStyle(e, "bodyContentStyle");
                                }

                                function editBrokerLinkStyle(e) {
                                    editStyle(e, "brokerLinkStyle");
                                }

                                function compareColor() {
                                    var backgroundColorField = document.getElementById("backgroundColor");
                                    var titleColorField = document.getElementById("title_font_color");
                                    var descriptionColorField = document.getElementById("description_font_color");
                                    var brokerColorField = document.getElementById("broker_link_font_color");
                                    var colorReg = /^#[0-9a-fA-F]{6}$/;
                                    if ('TRANSPARENT' != backgroundColorField.value && ! colorReg.test(backgroundColorField.value)) {
                                        alert(alert_color_incorrect.replace('<field name>', backgroundColorField.nextSibling.firstChild.nodeValue));
                                        focusElement(backgroundColorField);
                                        return;
                                    }
                                    if (! colorReg.test(titleColorField.value)) {
                                        alert(alert_color_incorrect.replace('<field name>', titleColorField.nextSibling.firstChild.nodeValue));
                                        focusElement(titleColorField);
                                        return;
                                    }
                                    if (! colorReg.test(descriptionColorField.value)) {
                                        alert(alert_color_incorrect.replace('<field name>', descriptionColorField.nextSibling.firstChild.nodeValue));
                                        focusElement(descriptionColorField);
                                        return;
                                    }
                                    if (! colorReg.test(brokerColorField.value)) {
                                        alert(alert_color_incorrect.replace('<field name>', brokerColorField.nextSibling.firstChild.nodeValue));
                                        focusElement(brokerColorField);
                                        return;
                                    }
                                    var titleColor = titleColorField ? titleColorField.value : previewer.style.head.lastFontColor;

                                    if (!colorReg.test(titleColor) ||
                                        (!colorReg.test(backgroundColorField.value) && ('TRANSPARENT' != backgroundColorField.value))) {
                                        return false;
                                    }

                                    if (backgroundColorField.value.toUpperCase() == titleColor.toUpperCase()) {
                                        alert("Background color and font colors cannot be the same.");
                                        backgroundColorField.value = previewer.style.lastBackgroundColor;
                                        titleColorField.value = previewer.style.head.lastFontColor;
                                        return false;
                                    }

                                    return true;
                                }

                                function previewT() {
                                    if (!compareColor()) return;
                                    previewer.style.lastBackgroundColor = document.getElementById('backgroundColor').value;
                                    previewer.style.head.lastFontColor = document.getElementById('title_font_color').value;
                                    previewer.setBackgroundColor(document.getElementById("backgroundColor").value);
                                    previewer.setStyle('head', 'color', document.getElementById("title_font_color").value);
                                    previewer.setStyle('body', 'color', document.getElementById("description_font_color").value);
                                    previewer.setStyle('brokerLink', 'color', document.getElementById("broker_link_font_color").value);
                                }

                                var previewer = new GTBPreviewer(ad);
                                previewer.render();
                                previewer.style.lastBackgroundColor = previewer.style.background;
                                previewer.style.head.lastFontColor = previewer.style.head.color;
                                var warning = document.createElement('div');
                                warning.style.display = 'none';
                                previewer.adBlock.parentNode.insertBefore(warning, previewer.adBlock);
                                var warningMessage = 'The ad cannot be shown correctly because the specified size is too small.';
                                warning.innerHTML = '<span class="warning">Warning: ' + warningMessage + '</span><br /><br />';
                                previewer.onOverflow = function (isOverflow) {
                                    warning.style.display = isOverflow ? 'block' : 'none';
                                }

                                    previewer.setHeadOnClickHandler(editHeadStyle);
                                    previewer.setBodyOnClickHandler(editBodyStyle);
                                    previewer.setBrokerLinkOnClickHandler(editBrokerLinkStyle);

                                    if (gtbWidthInputElement && gtbWidthInputElement) {
                                        previewer.onSizeChange = function (width, height) {
                                            gtbWidthInputElement.value = width;
                                            gtbHeightInputElement.value = height;
                                        }
                                    }
                                // -->
                                </script>
                                <div id="bodyContentStyle" style="display: none; position: absolute; width: 280px;">
                                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                                    <tbody>
                                    <tr>
                                        <td style="width: 11px; height: 11px;"><img src="images/top-left.gif" alt=""></td>
                                        <td style="width: 100%; background-image: url(images/top-mid.gif); background-repeat: repeat;"></td>
                                        <td style="width: 11px;"><img src="images/top-right.gif" alt=""></td>
                                    </tr>
                                    <tr>
                                        <td style="width: 11px; background-image: url(images/left-mid.gif); background-repeat: repeat;"></td>
                                        <td style="background: rgb(249, 247, 247) none repeat scroll 0%; width: 100%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;">
                                        <table width="100%">
                                        <tbody>
                                        <tr>
                                            <td style="text-align: center;">Body Style Edit</td>
                                            <td style="width: 16px;">
                                            <img style="cursor: pointer;" src="images/closing-button.bmp" alt="" onclick="javascript:closeStyleWindow('bodyContentStyle')">
                                            </td>
                                        </tr>
                                        </tbody>
                                        </table>
                                        <table style="text-align: left;">
                                        <tbody>
                                        <tr>
                                            <td>Font Size:</td>
                                            <td>
                                                <select id="description_font_size" class="flat" name="description_font_size" onchange="javascript:isChanged = true;previewer.setStyle('body', 'fontSize', this.value+'px');">
                                                    <option label="1" value="8">1</option>
                                                    <option label="2" value="9">2</option>
                                                    <option label="3" value="10">3</option>
                                                    <option label="4" value="11">4</option>
                                                    <option label="5" value="12">5</option>
                                                    <option label="6" value="13" selected="selected">6</option>
                                                    <option label="7" value="14">7</option>
                                                    <option label="8" value="15">8</option>
                                                    <option label="9" value="16">9</option>
                                                    <option label="10" value="17">10</option>
                                                </select> points
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Font Type:</td>
                                            <td>
                                                <select class="flat" id="description_font_type" name="description_font_type" onchange="javascript:isChanged = true;previewer.setStyle('body', 'fontFamily', this.value);">
                                                    <option label="Arial" value="Arial" selected="selected">Arial</option>
                                                    <option label="Georgia" value="Georgia">Georgia</option>
                                                    <option label="Sans-serif" value="MS Sans Serif">Sans-serif</option>
                                                    <option label="Times" value="Times">Times</option>
                                                    <option label="Verdana" value="Verdana">Verdana</option>
                                                </select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Color:</td>
                                            <td>
                                                <input id="description_font_color" name="description_font_color" class="flat" size="10" maxlength="10" value="#000000" onchange="javascript:isChanged = true;commonPreview(preview);" type="text"><a class="colorformat">Body Color</a>
                                                <img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="Palette" onclick="javascript:onClickPalette('description_font_color', this, false);">
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Attributes:</td>
                                            <td>
                                                <input id="description_bold" name="description_bold" size="25" value="Bold" onclick="javascript:isChanged = true;var value=this.checked?'bold':'normal'; previewer.setStyle('body', 'fontWeight', value);" type="checkbox">
                                                <label style="cursor: pointer;" for="description_bold">Bold</label>
                                                <input id="description_underline" name="description_underline" size="25" value="Underline" onclick="isChanged = true;var value=this.checked?'underline':'none'; previewer.setStyle('body', 'textDecoration', value);" type="checkbox">
                                                <label style="cursor: pointer;" for="description_underline">Underline</label>
                                                <input id="description_italic" name="description_italic" size="25" value="Italic" onclick="isChanged = true;var value=this.checked?'italic':'normal'; previewer.setStyle('body', 'fontStyle', value);" type="checkbox">
                                                <label style="cursor: pointer;" for="description_italic">Italic</label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Horizontal Align:</td>
                                            <td>
                                                <select class="flat" id="description_align" name="description_align" onchange="javascript:isChanged = true;previewer.setStyle('body', 'textAlign', this.value);">
                                                    <option value="left">Left</option>
                                                    <option value="center" selected="selected">Center</option>
                                                    <option value="right">Right</option>
                                                </select>
                                            </td>
                                        </tr>
                                        </tbody>
                                        </table>
                                        </td>
                                        <td style="width: 11px; background-image: url(images/right-mid.gif); background-repeat: repeat;"></td>
                                    </tr>
                                    <tr>
                                        <td style="height: 11px;"><img src="images/bottom-left.gif" alt=""></td>
                                        <td style="width: 100%; background-image: url(images/bottom-mid.gif); background-repeat: repeat;"></td>
                                        <td><img src="images/bottom-right.gif" alt=""></td>
                                    </tr>
                                    </tbody>
                                    </table>
                                </div>
                                <div id="headerContentStyle" style="display: none; position: absolute; width: 280px;">
                                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                                    <tbody>
                                    <tr>
                                        <td style="width: 11px; height: 11px;"><img src="images/top-left.gif" alt=""></td>
                                        <td style="width: 100%; background-image: url(images/top-mid.gif); background-repeat: repeat;"></td>
                                        <td style="width: 11px;"><img src="images/top-right.gif" alt=""></td>
                                    </tr>
                                    <tr>
                                        <td style="width: 11px; background-image: url(images/left-mid.gif); background-repeat: repeat;"></td>
                                        <td style="background: rgb(249, 247, 247) none repeat scroll 0%; width: 100%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;">
                                        <table width="100%">
                                        <tbody>
                                        <tr>
                                            <td style="text-align: center;">Header Style Edit</td>
                                            <td style="width: 16px;">
                                            <img style="cursor: pointer;" src="images/closing-button.bmp" alt="" onclick="javascript:closeStyleWindow('headerContentStyle')">
                                            </td>
                                        </tr>
                                        </tbody>
                                        </table>
                                        <table style="text-align: left;">
                                        <tbody>
                                        <tr>
                                            <td>Font Size:</td>
                                            <td>
                                                <select id="title_font_size" class="flat" name="title_font_size" onchange="javascript:isChanged = true;previewer.setStyle('head', 'fontSize', this.value+'px');">
                                                    <option label="1" value="8">1</option>
                                                    <option label="2" value="9">2</option>
                                                    <option label="3" value="10">3</option>
                                                    <option label="4" value="11">4</option>
                                                    <option label="5" value="12">5</option>
                                                    <option label="6" value="13">6</option>
                                                    <option label="7" value="14">7</option>
                                                    <option label="8" value="15" selected="selected">8</option>
                                                    <option label="9" value="16">9</option>
                                                    <option label="10" value="17">10</option>
                                                </select> points
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Font Type:</td>
                                            <td>
                                                <select class="flat" id="title_font_type" name="title_font_type" onchange="javascript:isChanged = true;previewer.setStyle('head', 'fontFamily', this.value);">
                                                    <option label="Arial" value="Arial" selected="selected">Arial</option>
                                                    <option label="Georgia" value="Georgia">Georgia</option>
                                                    <option label="Sans-serif" value="MS Sans Serif">Sans-serif</option>
                                                    <option label="Times" value="Times">Times</option>
                                                    <option label="Verdana" value="Verdana">Verdana</option>
                                                </select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Color:</td>
                                            <td>
                                                <input id="title_font_color" name="title_font_color" class="flat" size="10" maxlength="10" value="#000000" onchange="javascript:isChanged = true;commonPreview(preview);" type="text"><a class="colorformat">Headline Color</a>
                                                <img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="Palette" onclick="javascript: onClickPalette('title_font_color', this, false);">
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Attributes:</td>
                                            <td>
                                                <input id="title_bold" name="title_bold" size="25" value="Bold" checked="checked" onclick="javascript:isChanged = true;var value=this.checked?'bold':'normal'; previewer.setStyle('head', 'fontWeight', value);" type="checkbox">
                                                <label style="cursor: pointer;" for="title_bold">Bold</label>
                                                <input id="title_underline" name="title_underline" size="25" value="Underline" onclick="isChanged = true;var value=this.checked?'underline':'none'; previewer.setStyle('head', 'textDecoration', value);" type="checkbox">
                                                <label style="cursor: pointer;" for="title_underline">Underline</label>
                                                <input id="title_italic" name="title_italic" size="25" value="Italic" onclick="isChanged = true;var value=this.checked?'italic':'normal'; previewer.setStyle('head', 'fontStyle', value);" type="checkbox">
                                                <label style="cursor: pointer;" for="title_italic">Italic</label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Horizontal Align:</td>
                                            <td>
                                                <select class="flat" id="title_align" name="title_align" onchange="javascript:isChanged = true;previewer.setStyle('head', 'textAlign', this.value);">
                                                    <option value="left">Left</option>
                                                    <option value="center" selected="selected">Center</option>
                                                    <option value="right">Right</option>
                                                </select>
                                            </td>
                                        </tr>
                                        </tbody>
                                        </table>
                                        </td>
                                        <td style="width: 11px; background-image: url(images/right-mid.gif); background-repeat: repeat;"></td>
                                    </tr>
                                    <tr>
                                        <td style="height: 11px;"><img src="images/bottom-left.gif" alt=""></td>
                                        <td style="width: 100%; background-image: url(images/bottom-mid.gif); background-repeat: repeat;"></td>
                                        <td><img src="images/bottom-right.gif" alt=""></td>
                                    </tr>
                                    </tbody>
                                    </table>
                                </div>
                                <div id="brokerLinkStyle" style="display: none; position: absolute; width: 280px;">
                                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                                    <tbody>
                                    <tr>
                                        <td style="width: 11px; height: 11px;"><img src="images/top-left.gif" alt=""></td>
                                        <td style="width: 100%; background-image: url(images/top-mid.gif); background-repeat: repeat;"></td>
                                        <td style="width: 11px;"><img src="images/top-right.gif" alt=""></td>
                                    </tr>
                                    <tr>
                                        <td style="width: 11px; background-image: url(images/left-mid.gif); background-repeat: repeat;"></td>
                                        <td style="background: rgb(249, 247, 247) none repeat scroll 0%; width: 100%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;">
                                        <table width="100%">
                                        <tbody>
                                        <tr>
                                            <td style="text-align: center;">Broker Link Style Edit</td>
                                            <td style="width: 16px;">
                                            <img style="cursor: pointer;" src="images/closing-button.bmp" alt="" onclick="javascript:closeStyleWindow('brokerLinkStyle')">
                                            </td>
                                        </tr>
                                        </tbody>
                                        </table>
                                        <table style="text-align: left;">
                                        <tbody>
                                        <tr>
                                            <td>Font Size:</td>
                                            <td>
                                                <select id="broker_link_font_size" class="flat" name="broker_link_font_size" onchange="javascript:isChanged = true;previewer.setStyle('brokerLink', 'fontSize', this.value+'px');">
                                                    <option label="1" value="8">1</option>
                                                    <option label="2" value="9">2</option>
                                                    <option label="3" value="10">3</option>
                                                    <option label="4" value="11" selected="selected">4</option>
                                                    <option label="5" value="12">5</option>
                                                    <option label="6" value="13">6</option>
                                                    <option label="7" value="14">7</option>
                                                    <option label="8" value="15">8</option>
                                                    <option label="9" value="16">9</option>
                                                    <option label="10" value="17">10</option>
                                                </select> points
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Font Type:</td>
                                            <td>
                                                <select class="flat" id="broker_link_font_type" name="broker_link_font_type" onchange="javascript:isChanged = true;previewer.setStyle('brokerLink', 'fontFamily', this.value);">
                                                    <option label="Arial" value="Arial" selected="selected">Arial</option>
                                                    <option label="Georgia" value="Georgia">Georgia</option>
                                                    <option label="Sans-serif" value="MS Sans Serif">Sans-serif</option>
                                                    <option label="Times" value="Times">Times</option>
                                                    <option label="Verdana" value="Verdana">Verdana</option>
                                                </select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Color:</td>
                                            <td>
                                                <input id="broker_link_font_color" name="broker_link_font_color" class="flat" size="10" maxlength="10" value="#000000" onchange="javascript:isChanged = true;commonPreview(preview);" type="text"><a class="colorformat">Broker Link Color</a>
                                                <img style="cursor: pointer; padding-left: 3px;" src="images/palette.gif" alt="Palette" onclick="javascript: onClickPalette('broker_link_font_color', this, false);">
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Attributes:</td>
                                            <td>
                                                <input id="broker_link_bold" name="broker_link_bold" size="25" value="Bold" onclick="javascript:isChanged = true;var value=this.checked?'bold':'normal'; previewer.setStyle('brokerLink', 'fontWeight', value);" type="checkbox">
                                                <label style="cursor: pointer;" for="broker_link_bold">Bold</label>
                                                <input id="broker_link_underline" name="broker_link_underline" size="25" value="Underline" onclick="javascript:isChanged = true;var value=this.checked?'underline':'none'; previewer.setStyle('brokerLink', 'textDecoration', value);" type="checkbox">
                                                <label style="cursor: pointer;" for="broker_link_underline">Underline</label>
                                                <input id="broker_link_italic" name="broker_link_italic" size="25" value="Italic" onclick="javascript:isChanged = true;var value=this.checked?'italic':'normal'; previewer.setStyle('brokerLink', 'fontStyle', value);" type="checkbox">
                                                <label style="cursor: pointer;" for="broker_link_italic">Italic</label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Horizontal Align:</td>
                                            <td>
                                                <select class="flat" id="broker_link_align" name="broker_link_align" onchange="javascript:isChanged = true;previewer.setStyle('brokerLink', 'textAlign', this.value);">
                                                    <option value="left">Left</option>
                                                    <option value="center" selected="selected">Center</option>
                                                    <option value="right">Right</option>
                                                </select>
                                            </td>
                                        </tr>
                                        </tbody>
                                        </table>
                                        </td>
                                        <td style="width: 11px; background-image: url(images/right-mid.gif); background-repeat: repeat;"></td>
                                    </tr>
                                    <tr>
                                        <td style="height: 11px;"><img src="images/bottom-left.gif" alt=""></td>
                                        <td style="width: 100%; background-image: url(images/bottom-mid.gif); background-repeat: repeat;"></td>
                                        <td><img src="images/bottom-right.gif" alt=""></td>
                                    </tr>
                                    </tbody>
                                    </table>
                                </div>
                            </div>
                            <div style="margin-top: 10px;">Please Note: Click on a specific property to edit it.</div>
                            </div>
                            </td>
                        </tr>
                        </tbody>
                        </table>
                        </td>
                    </tr>
                    <tr class="commAd" datafld="customize_commBreak" style="display: none;">
                        <td>commercial break</td>
                    </tr>
                    <script type="text/javascript">
                    val0 = jQuery('#adspaceName').find('option:selected').val();
                    jQuery('.textAd').each(function(){
                        if(jQuery(this).attr('datafld')==val0)
                            // set display
                            jQuery(this).css('display','');
                        else
                            // hide
                            jQuery(this).hide();
                    });
                    jQuery('.bannerAd').each(function(){
                        if(jQuery(this).attr('datafld')==val0)
                            // set display
                            jQuery(this).css('display','');
                        else
                            // hide
                            jQuery(this).hide();
                    });
                    jQuery('.thumbAd').each(function(){
                        if(jQuery(this).attr('datafld')==val0)
                            // set display
                            jQuery(this).css('display','');
                        else
                            // hide
                            jQuery(this).hide();
                    });
                    jQuery('.commAd').each(function(){
                        if(jQuery(this).attr('datafld')==val0)
                            // set display
                            jQuery(this).css('display','');
                        else
                            // hide
                            jQuery(this).hide();
                    });

                    jQuery('document').ready(function(){
                        //intilitize
                        jQuery('#adspaceName').change(function(){
                            val = jQuery(this).find('option:selected').val();
                            jQuery('.textAd').each(function(){
                                if(jQuery(this).attr('datafld')==val)
                                    // set display
                                    jQuery(this).css('display','');
                                else
                                    // hide
                                    jQuery(this).hide();
                            });
                            jQuery('.bannerAd').each(function(){
                                if(jQuery(this).attr('datafld')==val)
                                    // set display
                                    jQuery(this).css('display','');
                                else
                                    // hide
                                    jQuery(this).hide();
                            });
                            jQuery('.thumbAd').each(function(){
                                if(jQuery(this).attr('datafld')==val)
                                    // set display
                                    jQuery(this).css('display','');
                                else
                                    // hide
                                    jQuery(this).hide();
                            });
                            jQuery('.commAd').each(function(){
                                if(jQuery(this).attr('datafld')==val)
                                    // set display
                                    jQuery(this).css('display','');
                                else
                                    // hide
                                    jQuery(this).hide();
                            });
                        });

                    });
                </script>
                    </table>
                </td>
                </tr>
                </table>
            </td>
            </tr>
        </table>
        </td>
    </tr>
</table>
</form>